<!doctype html>
<html lang="en">
<head>

<?php include './inc/css.html'; ?>

<style type="text/css">
    .swiper-wrapper{
       color:#fff;
    }
    .swiper-slide{
        text-align: center;
        /*line-height: 3rem;*/
        height: 1rem;
        background-size:cover;
        background-position: center center;
        background-repeat: no-repeat;
    }
    .swiper-slide .expertimg{
        height:.5rem;
        width: 100%;
        background-position: center center;
        background-repeat: no-repeat;
        background-size:cover;
        border-radius: 3px;
        margin:.05rem;
    }
    .swiper-slide .title{
        height:.25rem;
        line-height: .25rem;
    }
    .swiper-slide .subtitle{
        height:.15rem;
        line-height: .15rem;
        font-size: 80%;
    }
    .wrap{
        margin-bottom:.55rem;
    }

    .roomicon{
        height:.8rem;
        line-height: .35rem;
    }
    .roomicon p:first-child{
        font-size:150%;
    }
    .row{
        margin-left:0;
        margin-right:0;
    }
    .repair{
        line-height: .8rem;
    }
    .gorepair{
        font-size: .2rem;
        border:1px solid #eee;
        padding:.05rem .2rem;
        border-radius:.05rem;
    }

    .sectionheader{
        margin:0 auto;
    }

</style>

</head>
<body>



<?php include './inc/repairchose.html'; ?>

<div class="school lh5 tc fixed fixedshadow _bg_white">厦门大学</div>
<div class="wrap">
<!-- Start 实训室 -->
<div class="sectionheader tc">
    <div class="sectiontitle">实训室</div>
    <div class="sectionsubtitle _text_secondary ">实操出真知</div>
</div>

<div class="line1"></div>

<div class="row">
   <?php for ($i=1;$i<10;$i++) { ?>
    <div class="col-xs-3">
            <a class="roomicon tc" href="./trainroom_detail.php">
                <p class="navicon"><span class="ion-settings tran3"></span></p>
                <p class="navtext">实训室<?php echo $i; ?></p>
            </a>

    </div>
    <?php } ?>
</div>

<!-- End 实训室 -->

<div class="line15"></div>
<!-- Start 在线专家-->

<div class="sectionheader  tc">
    <div class="sectiontitle">在线专家</div>
    <div class="sectionsubtitle _text_secondary ">24hours内实时在线反馈</div>
</div>

<div class="line1"></div>
<div id="experts" class="swiper-container">
    <div class="swiper-wrapper">
        <?php for ($i=1;$i<9;$i++) { ?>
           <div class="swiper-slide">
            <a class="tc" href="javascript:layer.msg('给他打电话:138***');">
                <div class=" expertimg _bg_light" style="background-image:url(./../assets/img/staff<?php echo $i; ?>.jpg)">
                </div>
                <div class=" title">专家名字</div>
                <div class=" subtitle">专家头衔</div>
            </a>
           </div>
        <?php } ?>
    </div>
</div>

<!-- End 在线专家 -->
<div class="line1"></div>
<!-- Start 快速报修-->
<div class="sectionheader  tc">
    <div class="sectiontitle">快速报修</div>
    <div class="sectionsubtitle _text_secondary ">24hours内实时在线反馈</div>
</div>
<div class="line1"></div>
<div class="repair tc">
    <span class="gorepair ion-wrench"> 去报修</span>
</div>

 
</div>   

<?php include './inc/nav.html'; ?>
</body>

<?php include './inc/js.html'; ?>
<script type="text/javascript">
$(document).ready(function(){

  // 初始化专家轮播图
  var expertsSwiper = new Swiper ('#experts', {
        autoplay:3000,
        slidesPerView : 3.5,
        spaceBetween : 10

    } ) ;
})

</script>
</html>